<template>
	<view>
		<view class='tools'>
			<xd-tools-child></xd-tools-child>
		</view>
		<view class='input'>
			<uni-forms ref="form" :modelValue="formData">
				<uni-row >
					<uni-col :xs="{span:20,offset:2}" :sm="{span:10,offset:1}" >
						<uni-forms-item label="单据日期" :label-width="label_width" required>
							<uni-datetime-picker type="date"
							
							start="2000-3-20"
							end="2030-6-20"
							:clear-icon="false" 
							v-model="formData.datetimesingle"/>
						</uni-forms-item>
					</uni-col>
					<uni-col :xs="{span:20,offset:2}" :sm="{span:10,offset:1}" >
						<uni-forms-item label="取样员" :label-width="label_width"  required>
							<uni-data-select 
								:clear="false"
								  v-model="formData.sampler"
								  :localdata="formData.samplers_range"
								 
							></uni-data-select>
						</uni-forms-item>
					</uni-col>
				</uni-row>
				<uni-row >
					<uni-col :xs="{span:20,offset:2}" :sm="{span:10,offset:1}" >
						<uni-forms-item label="取样方法" :label-width="label_width"  required>
							<uni-data-select
								:clear="false"
								  v-model="formData.sampler"
								  :localdata="formData.samplers_range"
								 
							></uni-data-select>
						</uni-forms-item>
					</uni-col>
					<uni-col :xs="{span:20,offset:2}" :sm="{span:10,offset:1}" >
						<uni-forms-item label="取样位置" :label-width="label_width"  required>
							<uni-data-select
								:clear="false"
								  v-model="formData.sampler"
								  :localdata="formData.samplers_range"
								 
							></uni-data-select>
						</uni-forms-item>
					</uni-col>
					
				</uni-row>
				<uni-row >
				<uni-col :xs="{span:20,offset:2}" :sm="{span:10,offset:1}" >
					<uni-forms-item label="取样类型" :label-width="label_width"  required>
						<uni-data-select
							:clear="false"
							  v-model="formData.sampler"
							  :localdata="formData.samplers_range"
							 
						></uni-data-select>
					</uni-forms-item>
				</uni-col>
				</uni-row>
				<uni-row >
					<uni-col :xs="{span:20,offset:2}" :sm="{span:21,offset:1}" >
						<uni-forms-item label="备注" :label-width="label_width"  required>
							<uni-easyinput v-model="formData.name" placeholder="请输入姓名" />
						</uni-forms-item>
					</uni-col>
					
				</uni-row>
				<view class='table' >
					<uni-table border stripe emptyText="暂无更多数据"   >
						<!-- 表头行 -->
						<uni-tr>
							<uni-th align="center">品名</uni-th>
							<uni-th align="center">简拼</uni-th>
							<uni-th align="left">规格</uni-th>
							<uni-th align="left">批号</uni-th>
							<uni-th align="left">产地</uni-th>
							<uni-th align="left">请验量</uni-th>
							<uni-th align="left">取样量</uni-th>
							<uni-th align="left">单位</uni-th>
							<uni-th align="left">操作</uni-th>
						</uni-tr>
						<!-- 表格数据行 -->
						<uni-tr>
							<uni-td><uni-easyinput  suffixIcon="search" 
							v-model="value" 
							placeholder="右侧图标" 
							@iconClick="iconClick"></uni-easyinput></uni-td>
							<uni-td>Jeson</uni-td>
							<uni-td>北京市海淀区</uni-td>
							<uni-td>北京市海淀区</uni-td>
							<uni-td>北京市海淀区</uni-td>
							<uni-td>北京市海淀区</uni-td>
							<uni-td>北京市海淀区</uni-td>
							<uni-td>北京市海淀区</uni-td>
							<uni-td><button   class="text " type="primary" plain @click="addClick">确认</button>
		<button  class="text" type="primary" plain >取消</button></uni-td>
						</uni-tr>
						
					
					</uni-table>
					<uni-pagination title="标题文字" show-icon="true" total="50" current="2"></uni-pagination>
				</view>
			</uni-forms>
			
		</view>
	</view>
</template>

<script setup>
import { computed,ref } from "vue";
import  store  from "@/store/index.js"
let form =ref(null)
const label_width=ref('80px')
let formData=ref({
	name:'ddd',
	datetimesingle:'2022-10-16',
	sampler:'zhangsan',
	samplers_range:[
		{ value: '0', text: "张三" },
		{ value: '1', text: "李四" },
		
	]
})

</script>

<style lang="scss">
.example {
		padding: 15px;
		background-color: #fff;
	}

	.segmented-control {
		margin-bottom: 15px;
	}

	.button-group {
		margin-top: 15px;
		display: flex;
		justify-content: space-around;
	}

	.form-item {
		display: flex;
		align-items: center;
	}

	.button {
		display: flex;
		align-items: center;
		height: 35px;
		margin-left: 10px;
	}
</style>
